<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<!--引入cesium基础lib-->
		<link href="https://registry.npmmirror.com/mars3d-cesium/latest/files/Build/Cesium/Widgets/widgets.css"
			rel="stylesheet" type="text/css" />
		<script src="https://registry.npmmirror.com/mars3d-cesium/latest/files/Build/Cesium/Cesium.js"
			type="text/javascript"></script>

		<!--引入mars3d库lib-->
		<link href="https://registry.npmmirror.com/mars3d/latest/files/mars3d.css" rel="stylesheet" type="text/css" />
		<script src="https://registry.npmmirror.com/mars3d/latest/files/mars3d.js" type="text/javascript"></script>
		<style>
			html,
			body,
			.mars3d-container {
				height: 100%;
				width: 100%;
				margin: 0;
				padding: 0;
				border: none;
				overflow: hidden;
			}
		</style>
	</head>
	<body>
		<!-- 为 Mars3D 准备一个定义了宽高的 DOM -->
		<div id="mars3dContainer" class="mars3d-container"></div>
		<script type="text/javascript">
			//     var mapOptions = {
			//       basemaps: [{ name: "天地图", type: "tdt", layer: "img_d", show: true }],
			// scene: {
			//     showSun: false,
			//     showMoon: false,
			//     showSkyBox: false,
			//     showSkyAtmosphere: false,
			//     fog: false,
			//     backgroundColor: "#363635", // 天空背景色
			//     globe: {
			//       baseColor: "#363635", // 地球地面背景色
			//       showGroundAtmosphere: false,
			//       enableLighting: false
			//     },
			//     clock: {
			//       currentTime: "2023-11-01 12:00:00" // 固定光照时间
			//     },
			//     cameraController: {
			//       zoomFactor: 1.5,
			//       minimumZoomDistance: 0.1,
			//       maximumZoomDistance: 200000,
			//       enableCollisionDetection: false // 允许进入地下
			//     }
			//   }
			//     };
			//     var map = new mars3d.Map("mars3dContainer", mapOptions); //支持的参数请看API文档：http://mars3d.cn/api/Map.html

			//  var tiles3dLayer = new mars3d.layer.TilesetLayer({
			//    // url: 'http://data.mars3d.cn/3dtiles/qx-simiao/tileset.json',
			// url: 'http://data.mars3d.cn/3dtiles/max-fsdzm/tileset.json',
			//    maximumScreenSpaceError: 16,
			// maxMemory: 1024, // 最大缓存内存大小(MB)
			//    cacheBytes: 1073741824, 
			//    maximumCacheOverflowBytes: 2147483648, 
			//  popup: "all",
			// matrixMove: {
			//   hasMiddle: false
			// },
			//    position: { alt: 452.9 },
			//    center: { lat: 34.216894,  lng: 108.959834, alt: 591, heading: 4,pitch: -37 }, 
			//    flyTo: true,
			//  })
			//  map.addLayer(tiles3dLayer)
			//   tiles3dLayer.readyPromise
			//   .then(() => {
			// 	// 加载完成
			// 	console.log("模型加载完成", tiles3dLayer)
			//   })
			//   .catch((e) => {
			// 	// 加载失败
			// 	console.log("模型加载失败", e)
			//   })

			//   // 加载完成事件
			//    tiles3dLayer.on(mars3d.EventType.updatePosition, function (event) {
			//      eventTarget.fire("changePoition", {
			//        center: tiles3dLayer.center,
			//        rotation: tiles3dLayer.rotation
			//      })
			//    })

			// 初始化地图
			const mapOptions = {
				basemaps: [{
					name: "天地图",
					type: "tdt",
					layer: "img_d",
					show: true
				}],
				scene: {
					center: {
						lat: 29.791416, // 3d模型加载要与scene场景的中心经纬度一直才能再视角内看到
						lng: 121.479394,
						alt: 53.3, // 高度
						heading: 0,
						pitch: -60
					} // 示例位置：上海
				}
			};

			const map = new mars3d.Map("mars3dContainer", mapOptions);

			// 加载3D Tileset倾斜摄影模型
			const tilesetLayer = new mars3d.layer.TilesetLayer({
				url: 'http://data.mars3d.cn/3dtiles/max-fsdzm/tileset.json', // 替换为你的Tileset URL
				maximumScreenSpaceError: 16, // 设置渲染质量，越小质量越好，但性能要求更高
				cullWithChildrenBounds: true, // 提高性能，可以根据需要调整
				dynamicScreenSpaceError: true // 启用动态屏幕空间误差
			});

			map.addLayer(tilesetLayer);

			// 可选：添加事件绑定或其他功能
			tilesetLayer.on('load', (event) => {
				console.log('Tileset 加载完成', event);
			});
		</script>
	</body>
</html>